﻿var Calendar = function () {
    toastr.options = {
        "closeButton": false,
        "debug": false,
        "positionClass": "toast-top-center",
        "onclick": null,
        "showDuration": "500",
        "hideDuration": "500",
        "timeOut": "2000",
        "extendedTimeOut": "1000",
        "showEasing": "swing",
        "hideEasing": "linear",
        "showMethod": "fadeIn",
        "hideMethod": "fadeOut"
    };
    var eventPanel = $("#event_panel");

    var initCalendar = function () {
        if (!jQuery().fullCalendar) {
            return;
        }

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();
        var calendar = $('#calendar');

        var h = {};

        if (Metronic.isRTL()) {
            if (calendar.parents(".portlet").width() <= 720) {
                calendar.addClass("mobile");
                h = {
                    right: 'title, prev, next',
                    center: '',
                    left: 'agendaDay, agendaWeek, month, today'
                };
            } else {
                calendar.removeClass("mobile");
                h = {
                    right: 'title',
                    center: '',
                    left: 'agendaDay, agendaWeek, month, today, prev,next'
                };
            }
        } else {
            if (calendar.parents(".portlet").width() <= 720) {
                calendar.addClass("mobile");
                h = {
                    left: 'title, prev, next',
                    center: '',
                    right: 'today,month,agendaWeek,agendaDay'
                };
            } else {
                calendar.removeClass("mobile");
                h = {
                    left: 'title',
                    center: '',
                    right: 'prev,next,today,month,agendaWeek,agendaDay'
                };
            }
        }

        calendar.fullCalendar('destroy'); // destroy the calendar
        calendar.fullCalendar({
            header: h,
            defaultView: 'month',
            viewRender: function (view, element) {
                calendar.fullCalendar("removeEvents");

                $.ajax({
                    url: "/Calendar/GetEvents",
                    type: "POST",
                    data: {
                        start: moment(view.start).format("YYYY-MM-DD HH:mm:ss"),
                        end: moment(view.end).format("YYYY-MM-DD HH:mm:ss")
                    },
                    success: function (rsp) {
                        if (rsp.Result) {
                            function render() {
                                setTimeout(function () {
                                    var d = rsp.Data.shift();
                                    var event = {};

                                    if (!d) return;

                                    event["objID"] = d.ID;
                                    event["repeat"] = d.RepeatType;
                                    event["title"] = d.Title;
                                    event["start"] = moment(d.StartTimeString, "YYYY-MM-DD HH:mm:ss");
                                    event["end"] = moment(d.EndTimeString, "YYYY-MM-DD HH:mm:ss");
                                    event["color"] = d.Color;
                                    event["textColor"] = d.TextColor;
                                    event["editable"] = true;

                                    calendar.fullCalendar("renderEvent", event);

                                    render();
                                }, 1);
                            }

                            render();

                        } else {
                            toastr["error"](rsp.Message, "载入事件");
                        }
                    },
                    error: function () {
                        toastr["error"]("程序碰到问题没有正确执行！", "载入事件");
                    }
                });
            },
            eventClick: function (event, jsEvent, view) {
                $("#event_title").html(event["title"]);
                $("#txtEventStartDate").val(moment(event["start"]).format("YYYY-MM-DD HH:mm"));
                $("#txtEventEndDate").val(moment(event["end"]).format("YYYY-MM-DD HH:mm"));
                $("#ddlEventRepeat").val(event["repeat"]);
                $("#txtEventForeground").val(event["textColor"]).trigger("change");
                $("#txtEventBackground").val(event["color"]).trigger("change");
                eventPanel.modal('show');
            }
        });

        $(".form_meridian_datetime").datetimepicker({
            language: 'zh-CN',
            isRTL: Metronic.isRTL(),
            format: "yyyy-mm-dd hh:ii",
            showMeridian: true,
            autoclose: true,
            pickerPosition: (Metronic.isRTL() ? "bottom-right" : "bottom-left"),
            todayBtn: true
        });

        var styletmp = $("#styletmp");
        var txtForeground = $("#txtForeground");
        var txtBackground = $("#txtBackground");
        var styleEventTmp = $("#styleEventTmp");
        var txtEventForeground = $("#txtEventForeground");
        var txtEventBackground = $("#txtEventBackground");
        styletmp.css("color", txtForeground.val());
        styletmp.css("background-color", txtBackground.val());
        styleEventTmp.css("color", txtEventForeground.val());
        styleEventTmp.css("background-color", txtEventBackground.val());

        $('.colorpicker-default').colorpicker({
            format: 'hex'
        })
        .on("changeColor", function (e) {
            var color = e.color.toHex();
            if (this.id == "divForeground") {
                styletmp.css("color", color);
                txtForeground[0].defaultValue = color;
            } else {
                styletmp.css("background-color", color);
                txtBackground[0].defaultValue = color;
            }
        });

        $('.colorpicker-event').colorpicker({
            format: 'hex'
        })
        .on("changeColor", function (e) {
            var color = e.color.toHex();
            if (this.id == "divEventForeground") {
                styleEventTmp.css("color", color);
                txtEventForeground[0].defaultValue = color;
            } else {
                styleEventTmp.css("background-color", color);
                txtEventBackground[0].defaultValue = color;
            }
        });

        txtForeground.bind("change", function (e) {
            styletmp.css("color", this.value);
            this.defaultValue = this.value;
        });

        txtBackground.bind("change", function (e) {
            styletmp.css("background-color", this.value);
            this.defaultValue = this.value;
        });

        txtEventForeground.bind("change", function (e) {
            styleEventTmp.css("color", this.value);
            this.defaultValue = this.value;
        });

        txtEventBackground.bind("change", function (e) {
            styleEventTmp.css("background-color", this.value);
            this.defaultValue = this.value;
        });

        $("#event_add").bind("click", function (e) {
            e.preventDefault();
            var btn = $(this);
            var form = btn.closest("form");

            // 添加事件
            var source = {};

            source["events"] = [{
                title: $("#txtEventTitle").val(),
                start: moment($("#txtStartDate").val(), "YYYY-MM-DD HH:mm"),
                end: moment($("#txtEndDate").val(), "YYYY-MM-DD HH:mm")
            }];
            source["color"] = $("#txtBackground").val();
            source["textColor"] = $("#txtForeground").val();
            source["editable"] = true;

            btn.attr("disabled", "disabled");

            $.ajax({
                url: form.attr("action"),
                type: "POST",
                data: {
                    title: source.events[0].title,
                    start: moment(source.events[0].start).format("YYYY-MM-DD HH:mm:ss"),
                    end: moment(source.events[0].end).format("YYYY-MM-DD HH:mm:ss"),
                    color: source.color,
                    textColor: source.textColor,
                    repeat: $("#ddlRepeat").val()
                },
                success: function (rsp) {
                    if (rsp.Result) {
                        toastr["success"](rsp.Message, "添加事件");
                        calendar.fullCalendar("addEventSource", source);

                        form.trigger("reset");
                    } else {
                        toastr["error"](rsp.Message, "添加事件");
                    }
                },
                error: function () {
                    toastr["error"]("程序碰到问题没有正确执行！", "添加事件");
                },
                complete: function () {
                    btn.removeAttr("disabled");
                }
            });
        });


    };

    return {
        init: function () {
            initCalendar();
        }
    };
} ();